{{#if showConfirm}}
  {{#maybe-in-element wormholeReference false}}
    <div class="confirm-action-message">
      <div class="message is-highlight">
        <div class="message-title">
          <Icon @glyph="alert-triangle" />
          {{title}}
        </div>
        <p>
          {{message}}
        </p>
      </div>
      <div class="confirm-action-options">
        <button
          type="button"
          class="link is-destroy"
          data-test-confirm-button="true"
          onclick={{action "onConfirm"}}>
          {{confirmButtonText}}
        </button>
        <button
          type="button"
          class="link"
          data-test-confirm-cancel-button="true"
          {{action this.onCancel}}>
          {{cancelButtonText}}
        </button>
      </div>
    </div>
  {{/maybe-in-element}}
{{/if}}

<button
  type="button"
  class="link is-destroy"
  disabled={{showConfirm}}
  onclick={{action this.onTrigger id}}
  data-test-confirm-action-trigger={{id}}
  ...attributes
  >
  {{triggerText}}
</button>
